<!DOCTYPE html>
<html lang="en" class="no-js">
<head>
  <meta charset="utf-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />

  <title>telecomadmin</title>
  <meta name="description" content="telecomadmin" />
  <meta name="author" content="Roger Xu" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />

  <link rel="shortcut icon" href="/favicon.ico">
  <link rel="apple-touch-icon" href="/apple-touch-icon.png">

  <!-- CSS: implied media="all" -->
  <link rel="stylesheet" href="../css/style.css?v=2">

  <style>
    @import "http://ajax.googleapis.com/ajax/libs/dojo/1.6.1/dojo/resources/dojo.css";
    @import "http://ajax.googleapis.com/ajax/libs/dojo/1.6.1/dijit/themes/claro/claro.css";
  </style>

  <!-- All JavaScript at the bottom, except for Modernizr which enables HTML5 elements & feature detects -->
  <script src="../script/modernizr-1.7.min.js"></script>

  <style>
    .code {
        font-family: "Consolas", "Lucida Console", "Courier New";
    }
  </style>
</head>
<body class="claro">

  <!-- First header has an ID so you can give it individual styles, and target stuff inside it -->
  <header id="hd1">
    <!-- "hgroup" is used to make two headings into one, to prevent a new document node from forming -->
    <hgroup>
      <h1>telecomadmin</h1>
      <h2 id="version">Unknown Version</h2>
    </hgroup>

    <!-- Main nav, styled by targeting "#hd1 nav"; you can have more than one nav element per page -->
    <nav>
      <ul>
        <li><a href="#">Home</a></li>
        <li><a href="#">About</a></li>
        <li><a href="#">Services</a></li>
        <li><a href="#">Contact</a></li>
      </ul>
    </nav>
  </header><!-- #hd1 -->

  <!-- This is the main "div" that wraps the content generically; don't use "section" for this -->
  <article id="main">

    <!-- The first of two "section" elements for demo purposes; optional class added for styling (hs1 = "home section 1") -->
    <section class="hs1">
    <!-- Each section should begin with a new h1 (not h2), and optionally a header -->
    <!-- You can have more than one header/footer pair on a page -->
      <header>
        <h1>Chapter 1: The Period</h1>
      </header>

      <p>
It was the best of times, it was the worst of times,
it was the age of wisdom, it was the age of foolishness,
it was the epoch of belief, it was the epoch of incredulity,
it was the season of Light, it was the season of Darkness,
...
      </p>

      <!-- The h2 below is a sub heading relative to the h1 in this section, not for the whole document -->
      <h2>Demonstrating EM and STRONG</h2>

      <!-- "strong" is used for SEO and contextual hierarchy -->
      <p><strong>This text will have more importance (SEO-wise and contextually)</strong></p>

      <!-- "b" is used for stylistic offset of text that's NOT important contextually -->
      <p><b>This text has visual importance but has no contextual or SEO importance</b></p>

      <!-- "em" is used for colloquial-style emphasis -->
      <p>This is a <em>very</em> colloquial expression.</p>

      <footer>
        <p>Author: <cite>Louis Lazaris</cite></p>
      </footer>

    </section>

    <section class="hs2">
      <h1>This is another section</h1>
      <iframe id="frame" name="frame" src="http://www.baidu.com" style="height: 300px; width: 50%; min-width: 300px;"></iframe>
    </section><!-- .hs2 -->

  </article><!-- #main -->

  <aside>
    <h1>Archives</h1>
    <ul>
      <li><a href="/2007/09/">September 2007</a></li>
      <li><a href="/2007/08/">August 2007</a></li>
      <li><a href="/2007/07/">July 2007</a></li>
    </ul>
  </aside>

  <footer id="f1">
    <p>copyright &copy; 2011</p>
  </footer>

<!-- JavaScript at the bottom for fast page loading -->

<!-- Grab Google CDN's jQuery, with a protocol relative URL; fall back to local if necessary -->
<script src="http://ajax.googleapis.com/ajax/libs/dojo/1.6.1/dojo/dojo.xd.js.uncompressed.js" data-dojo-config='parseOnLoad: true, isDebug: true, locale: "en", dojoBlankHtmlUrl: "blank.html"'></script>
<script>
    dojo.require('dojo.date.locale');
    dojo.require('dojo.io.iframe');
    dojo.require('dojo.parser');

    dojo.require('dijit.dijit'); // optimize: load dijit layer
    dojo.require('dijit.ColorPalette');
    dojo.require('dijit.Dialog');
    dojo.require('dijit.Editor');
    dojo.require('dijit.InlineEditBox');
    dojo.require('dijit.Menu');
    dojo.require('dijit.TitlePane');
    dojo.require('dijit.Toolbar');
    dojo.require('dijit.ToolbarSeparator');
    dojo.require('dijit.TooltipDialog');

    dojo.require('dijit.form.Button');
    dojo.require('dijit.form.CheckBox');
    dojo.require('dijit.form.ComboBox');
    dojo.require('dijit.form.DateTextBox');
    dojo.require('dijit.form.DropDownButton');
    dojo.require('dijit.form.FilteringSelect');
    dojo.require('dijit.form.Form');
    dojo.require('dijit.form.NumberSpinner');
    dojo.require('dijit.form.NumberTextBox');
    dojo.require('dijit.form.RadioButton');
    dojo.require('dijit.form.SimpleTextarea');
    dojo.require('dijit.form.Textarea');
    dojo.require('dijit.form.TextBox');
    dojo.require('dijit.form.ToggleButton');
    dojo.require('dijit.form.ValidationTextBox');

    dojo.require('dijit.layout.BorderContainer');
    dojo.require('dijit.layout.ContentPane');

    dojo.require('dojox.data.AndOrWriteStore');
    dojo.require('dojox.encoding.base64');
    dojo.require('dojox.html.entities');

    dojo.require('dojox.layout.FloatingPane');
    dojo.require('dojox.layout.ResizeHandle');
    dojo.require('dojox.storage');
    dojo.require('dojox.validate');
    dojo.require('dojox.validate.web');
    dojo.require('dojox.widget.Standby');
    dojo.require('dojox.widget.Toaster');
</script>


<script>
// Constants
var Account = {};
</script>
<script>
// Functions
function login(username, password) {
    var baseUrl = 'http://192.168.1.1/login.cgi';
    var params = {};
    params['Username'] = username;
    params['Password'] = base64encode(password);
    params['Language'] = 1;
    params['RequestFile'] = 'html/content.asp';

    var queries = [];
    for (var key in params) {
        var query = dojo.replace('{0}={1}', [key, params[key]]);
        queries.push(query);
    }
    var url = baseUrl + '?' + queries.join('&');
    console.info('login', '=>', url);

    var iframe = dojo.byId('frame');
    console.debug(iframe);

    //setFrameSrc(iframe, url);
    return;

    // dojo.io.iframe.create: When using cross-domain Dojo builds, please save dojo/resources/blank.html to your domain and set djConfig.dojoBlankHtmlUrl to the path on your domain to blank.html
    dojo.io.iframe.send({
        // The target URL on your webserver:
        url: 'http://www.baidu.com',
        method: 'GET',
        handleAs: 'text',
        load: function(response, ioArgs) {
            console.debug(response);
            return response;
        },
        error: function(response, ioArgs){
            console.dir(response);

            // return the response for succeeding callbacks
            return response;
        }
  });
}

function base64encode(str) {
    var bytes = [];
    for (var i = 0; i < str.length; i++) {
        bytes.push(str.charCodeAt(i) & 0xFF);
    }

    var encoded = dojox.encoding.base64.encode(bytes);
    return encoded;
}

function setFrameSrc(iframe, src) {
    var idoc = null;
    if (dojo.isIE || dojo.isWebKit) {
        idoc = iframe.contentWindow.document;
    } else { // if (dojo.isMozilla) {
        idoc = iframe.contentWindow;
    }

    // For Safari (at least 2.0.3) and Opera, if the iframe
    // has just been created but it doesn't have content
    // yet, then iframe.document may be null. In that case,
    // use iframe.location and return.
    if (!idoc) {
        iframe.location = src;
        return;
    } else {
        idoc.location.replace(src);
    }
}
</script>

<!-- dojo ready -->
<script>
dojo.ready(function() {
    dojo.byId('version').innerHTML = 'Version ' + dojo.version;

    // define Account
    Account.SUPER_ADMIN = {
        username: 'telecomadmin',
        password: 'telecomadmin' + dojo.string.pad(1, 8) // telecomadmin + 8 digits
    };

    Account.USER_ADMIN = {
        username: 'useradmin',
        password: 'czkee'
    };

    // login
    var user = Account.USER_ADMIN;
    var n = 1;
    for (var i = 0; i < n; i++) {
        login(user.username, user.password);
    }
});
</script>

</body>
</html>
